import React, { useState } from 'react';
import { PageContainer, ProCard } from '@ant-design/pro-components';
import UserRole from './userrole';
import Roles from './roles';
export default (props: any) => {
  const [nowKey, setNowkey] = useState('1');
  return (
    <div
      style={{
        background: '#F5F7FA',
      }}
    >
      <PageContainer
        fixedHeader
        onTabChange={(key: any) => {
          setNowkey(key);
        }}
        header={{
          title: '',

          breadcrumb: {
            items: [
              {
                path: '',
                title: '一级页面',
              },
              {
                path: '',
                title: '二级页面',
              },
              {
                path: '',
                title: '当前页面',
              },
            ],
          },
        }}
        tabList={[
          {
            tab: '用户角色分配',
            key: '1',
          },
          {
            tab: '角色权限分配',
            key: '2',
          },
        ]}
      >
        {nowKey == '1' ? <UserRole /> : <Roles />}
      </PageContainer>
    </div>
  );
};
